<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'list.jsp' starting page</title>
    
	<%@include file="/WEB-INF/jsp/public/commons.jspf" %>
	
		<script type="text/javascript">
				
	
			var flag ; //判断走的是保存还是修改方法
			$(function(){
					$('#tree_org').treegrid({
							title:'权限列表', 
							iconCls:'icon-ok',
							nowrap: false,
							rownumbers: true,
							collapsible:true,
							url:'privilege_listJson.action',			
							idField:'id',				//数据表格要有主键	
							treeField:'name',			//treegrid 树形结构主键 text
							fitColumns:true ,
							columns:[[
								{field:'name',title:'权限名称',width:200} ,
								{field:'url',title:'url',width:120} ,
								
							]],
							onContextMenu: function(e,row){
								e.preventDefault();					//屏蔽浏览器的菜单
								$(this).treegrid('unselectAll');	//清除所有选中项
								$(this).treegrid('select', row.id);	//选中状态 
								$('#mm').menu('show', {
									left: e.pageX,
									top: e.pageY
								});
							}
					});
					
					$('#btn1').click(function(){
						
							if(flag == 'add'){
										//保存方法 
										//1 前台保存    注意: 没有保存id
										var node = $('#tree_org').treegrid('getSelected');
										$('#tree_org').treegrid('append',{
												parent:node.id ,
												data:[{
														name:$('#myform').find('input[name=name]').val(),
														url:$('#myform').find('input[name=url]').val()
												}]
										});
										
										//2 后台保存 
										$.ajax({
											type:'post',
											url:'privilege_add.action',
											cache:false , 
											dataType:'json',
											data:{
													parentId:node.id ,
													name:$('#myform').find('input[name=name]').val(),
													description:$('#myform').find('input[name=url]').val()
											} ,
											success:function(r){
													//刷新节点 : 刷新当前选中节点
													$('#tree_org').treegrid('reload',node.id);
													$.messager.show({
														title:'提示信息' , 
														msg:'操作成功!'
													});
											}
										});
										//3关闭窗口
										$('#div1').dialog('close');
							} else {
										$.ajax({
											type:'post',
											url:'privilege_edit.action',
											cache:false , 
											dataType:'json',
											data:{
													id:$('#myform').find('input[name=id]').val() ,
													name:$('#myform').find('input[name=name]').val(),
													url:$('#myform').find('input[name=url]').val()
											} ,
											success:function(r){
												//刷新节点  :如果当前选中的节点是叶子节点的话,刷新该节点的父亲 ,如果不是叶子节点,刷新当前选中节点即可
												var node = $('#tree_org').treegrid('getSelected');
												var parent = $('#tree_org').treegrid('getParent' , node.id);
											
												if(parent == null){
													$('#tree_org').treegrid('reload' ,parent);
												}else{
													$('#tree_org').treegrid('reload' , parent.id);
												}				
												
												$.messager.show({
													title:'提示信息',
													msg:'操作成功!'
												});
											}
										});
										//3关闭窗口
										$('#div1').dialog('close');
							}

								
								
					});
					
					//关闭窗口
					$('#btn2').click(function(){
							$('#div1').dialog('close');
					});

					
			});
			
			
			function append(){
						flag='add';
						//1清空表单数据
						$('#myform').form('clear');
						//2打开窗口
						$('#div1').dialog('open');
			}
			
			function update(){
						flag='edit';
						//1清空表单数据
						$('#myform').form('clear');
						//2填充表单回显数据
						var  node  = $('#tree_org').treegrid('getSelected');
						$('#myform').form('load',{
								id:node.id ,
								name:node.name ,
								url:node.url,
								parentId:node._parentId
						});
						//3打开窗口
						$('#div1').dialog('open');
			}
			
			function remove1(){
				$.messager.confirm("提示信息","确认删除?",function(r){
						if(r){
							// 1前台删除
							var  node  = $('#tree_org').treegrid('getSelected');
							$('#tree_org').treegrid('remove',node.id);
							// 2后台删除 
							$.post('privilege_delete.action' , {id:node.id} , function(result){
										
									$('#tree_org').treegrid('unselectAll');
									$('#tree_org').treegrid('reload');
									$.messager.show({
										title:'提示信息',
										msg:'操作成功!'
									});
							});
						} else {
							return ;
						}
						
				});
	}
			
	</script>
  </head>
  
  <body>
  		<table id="tree_org"></table>
  		<div id="div1" title="权限" class="easyui-dialog" style="width:400px;" closed=true modal=true >
  				<form id="myform" method="post">
  							<input type="hidden" name="id" value="" />
  						<table>
  							<tr>
  								<td>权限名称:</td>
  								<td><input name="name" value=""/></td>
  							</tr>
   							<tr>
  								<td>路径:</td>
  								<td><input type="text" name="url"/></td>
  							</tr>
  							<tr align="center">
  								<td colspan="2">
  									<a id="btn1" class="easyui-linkbutton">确定</a>
  									<a id="btn2" class="easyui-linkbutton">取消</a>
  								</td>
  							</tr>  							  							  							 							
  						</table>
  				</form>
  		</div>
  		
  		
		<div id="mm" class="easyui-menu" style="width:120px;">
			<div onclick="append()">新增</div>
			<div onclick="update()">修改</div>
			<div onclick="remove1()">删除</div>
		</div>  
  </body>
</html>
 
